/* 搜索框组件 */
import React from 'react'
import indexCss from './index.module.scss'

//withRouter函数  用来给小组件 传递路由信息对象
import { withRouter } from 'react-router-dom'
//解构连接方法
import { connect } from 'react-redux'
//引入action的初始化城市方法
// import { initCityAsync } from '../../store/actionCreator/index'

class Index extends React.Component {
    render() {
        console.log(this.props.cityName);

        return <div className={indexCss.city_select}>
            <div className={indexCss.city_select_search}>
                <div className={indexCss.city} onClick={() => {
                    console.log('城市列表');

                }}>{this.props.cityName}</div>
                <div className={indexCss.city_input}>
                    <i className={['iconfont icon-seach ', indexCss.city_input_icon].join(' ')}></i>
                    <input type="text" placeholder='请输入小区或地址' />
                </div>
            </div>
            <div className={indexCss.city_select_icon}>
                <i className={['iconfont icon-map', indexCss.city_select_icon_inner].join(' ')}></i>
            </div>
        </div>
    }
}
//映射对象
const mapStateToProps = (state) => {
    return {
        cityName: state.cityReducer.cityName
    }
}
//映射方法
// const mapDispatchToProps = (dispatch) => {
//     return {
//         initCity() {
//             dispatch(initCityAsync())
//         }
//     }
// }


export default connect(mapStateToProps, null)(withRouter(Index));